 <!-- 企业home页面 -->
<template>
  <div id="home">
    <!-- ----------------头部导航栏 -->
    <div class="home-header">
      <div class="home-header-box">
        <img class="header-logo" src="../image/QQ图片20220227003356.png" alt />
        <div class="header-tab3">
          <div class="tabbar upload-resume" @click="addjobinfo()">发布招聘</div>
          <div class="tabbar upload-resume" @click="lookjobinfo()">
            查看发布
          </div>
        </div>
        <!-- 添加招聘信息 -->
        <el-dialog
          :visible.sync="dialogVisible1"
          width="50%"
          :before-close="handleClose"
        >
          <add-job></add-job>
        </el-dialog>
        <!-- 查看招聘信息 -->
        <el-dialog
          :visible.sync="dialogVisible2"
          width="90%"
          :before-close="handleClose"
        >
          <add-job-list></add-job-list>
        </el-dialog>
        <!-- 去登陆注册 -->
        <div class="go-button">
          <el-button
            class="register-go go-item"
            @click="gotoCompany()"
            v-if="!userinfo"
            >企业</el-button
          >
          <el-button
            class="login-go go-item"
            @click="gotoUser()"
            v-if="!userinfo"
            >用户</el-button
          >
          <el-button
            class="login-go go-item"
            @click="gotoAdmin()"
            v-if="!userinfo"
            >管理员</el-button
          >
          <el-dropdown trigger="click" v-if="userinfo">
            <span class="el-dropdown-link">
              当前用户：{{ username }}
              <i class="el-icon-arrow-down el-icon--right"></i>
            </span>
            <el-dropdown-menu slot="dropdown">
              <el-button
                class="exit"
                :plain="true"
                style="border: none"
                @click="exit()"
                >退出</el-button
              >
            </el-dropdown-menu>
          </el-dropdown>
        </div>
      </div>
    </div>
    <!-- ----------------内容部分 -->
    <div class="home-content">
      <div class="big-logo">
        <img class="logo-photo" src="../image/QQ图片20220227003327.png" alt />
      </div>
      <!-- 搜索 -->
      <div class="searchBtn" style="display: flex">
        <el-input v-model="search" size="big" placeholder="输入求职岗位搜索" />
        <el-button
          size="small"
          icon="el-icon-search"
          style="height: 50px; width: 60px"
          @click="getresumeList()"
        ></el-button>
      </div>
          <!-- 推荐 -->
      <div class="job-list">
        <el-divider class="job-title">推荐简历</el-divider>
        <div class="job-box">
          <div class="job-box-item" v-for="item in tuiList" :key="item.id">
            <div class="job-left">
              <div class="job-box-item-top">
                <span class="job-name">{{ item.title }}</span>
                <span class="job-address">{{ item.type }}</span>
                <span class="job-pay">{{ item.createTime }}</span>
              </div>
              <div class="job-box-item-bottom">
                <div class="company-type">{{ item.content }}</div>
              </div>
            </div>
            <div class="job-right">
              <el-button
                type="primary"
                icon="el-icon-view"
                @click="resumeDetail(item.id)"
                >查看详情</el-button
              >
              <el-button
                style="heigth: 45px"
                icon="el-icon-download"
                @click="downloadFile(item)"
                >下载简历</el-button
              >
            </div>
          </div>
          <div class="null" v-show="this.list.length == 0">
            没有对应的简历....
          </div>
        </div>
        <!-- 列表详情弹窗 -->
        <el-dialog
          :visible.sync="dialogVisible3"
          width="50%"
          @close="clearComp()"
          @open="openComp()"
        >
          <resume-detail v-if="showComp" :jobId="id"></resume-detail>
        </el-dialog>
      </div>

      <!-- 求职者列表 -->
      <div class="job-list">
        <el-divider class="job-title">寻千里马</el-divider>
        <div class="job-tab">
          <span
            :class="jobTypeIndex == 'IT' ? 'active' : ''"
            @click="jobTypeClick('IT')"
            >IT/互联网</span
          >
          <span
            :class="jobTypeIndex == '金融' ? 'active' : ''"
            @click="jobTypeClick('金融')"
            >金融/股票</span
          >
          <span
            :class="jobTypeIndex == '医疗' ? 'active' : ''"
            @click="jobTypeClick('医疗')"
            >医疗/医药</span
          >
        </div>
        <div class="job-box">
          <div class="job-box-item" v-for="item in list" :key="item.id">
            <div class="job-left">
              <div class="job-box-item-top">
                <span class="job-name">{{ item.title }}</span>
                <span class="job-address">{{ item.type }}</span>
                <span class="job-pay">{{ item.createTime }}</span>
              </div>
              <div class="job-box-item-bottom">
                <div class="company-type">{{ item.content }}</div>
              </div>
            </div>
            <div class="job-right">
              <el-button
                type="primary"
                icon="el-icon-view"
                @click="resumeDetail(item.id)"
                >查看详情</el-button
              >
              <el-button
                style="heigth: 45px"
                icon="el-icon-download"
                @click="downloadFile(item)"
                >下载简历</el-button
              >
            </div>
          </div>
          <div class="null" v-show="this.list.length == 0">
            抱歉，没有找到您想要的信息..
          </div>
          <el-pagination
            @current-change="getresumeList"
            :current-page.sync="currentPage"
            :page-size="pageSize"
            layout="total, prev, pager, next"
            :total="total"
          ></el-pagination>
        </div>
        <!-- 列表详情弹窗 -->
        <el-dialog
          :visible.sync="dialogVisible3"
          width="50%"
          @close="clearComp()"
          @open="openComp()"
        >
          <resume-detail v-if="showComp" :jobId="id"></resume-detail>
        </el-dialog>
      </div>
    </div>
    <!-- ------------------底部 -->
    <div class="home-footer">
      <img src="../image/footer.png" />
    </div>
  </div>
</template>

<script>
import companyModel from "../request/index";
import addJob from "../components/addJob";
import addJobList from "../components/addJobList";
import resumeDetail from "../components/resumeDetail";
import axios from "../request/axios";
export default {
  //页面需要的数据
  data() {
    return {
      tuiList:[],
      id: "",
      userinfo: null,
      username: "",
      search: "", //搜索框的值
      dialogVisible1: false, //对话框开关
      dialogVisible2: false, //对话框开关
      dialogVisible3: false, //对话框开关
      showComp: true,
      jobTypeIndex: "IT", //职位下标
      currentPage: 1, //第几页
      pageSize: 5, //每页多少条
      list: [],
      total: null,
    };
  },

  //页面注册的组件
  components: {
    addJob,
    addJobList,
    resumeDetail,
  },
  //页面的事件和方法
  methods: {
    //跳转用户
    gotoUser() {
      this.$router.push({ path: "/user" });
    },
    //跳转企业
    gotoCompany() {
      this.$router.push({ path: "/company" });
    },
    //跳转管理员
    gotoAdmin() {
      this.$router.push({ path: "/admin" });
    },
    // 退出登录
    exit() {
      //删除用户信息
      window.localStorage.removeItem("userinfo");
      this.$router.push({ path: "/" });
      companyModel.companyLoginOut({});
      cookie.remove("satoken");
      this.$message.success("注销成功");
    },
    // 打开添加招聘信息
    addjobinfo() {
      this.dialogVisible1 = true;
      if (!this.userinfo) {
        this.$router.push({ path: "/company" });
      }
    },
    // 打开查看招聘信息
    lookjobinfo() {
      this.dialogVisible2 = true;
      if (!this.userinfo) {
        this.$router.push({ path: "/company" });
      }
    },
    //下载简历
    downloadFile(item) {
      if (item.fileInfo == null) {
        this.$message.error("文件不存在！");
      } else
        window.location.href =
          axios.defaults.baseURL + "file/download/" + item.fileInfo.id;
    },
    // 对话框关闭
    handleClose() {
      this.dialogVisible1 = false;
      this.dialogVisible2 = false;
    },
    // 打开对话框（查询列表）
    clearComp() {
      this.dialogVisible3 = false;
      this.showComp = false;
    },
    // 关闭对话框（查询列表）
    openComp() {
      this.dialogVisible3 = true;
      this.showComp = true;
    },
    //职位tab切换
    jobTypeClick(type) {
      this.jobTypeIndex = type;
      this.getresumeList();
    },

    // 获取简历详情
    resumeDetail(itemid) {
      this.dialogVisible3 = true;
      this.id = itemid;
    },

    // 请求简历信息列表
    getresumeList(page = 1) {
      this.pageNo = page;
      companyModel
        .getresumeList({
          pageNo: this.currentPage,
          pageSize: this.pageSize,
          type: this.jobTypeIndex,
          title: this.search,
        })
        .then((res) => {
          if (res.data.code === 200) {
            const result = res.data.result;
            this.list = result.records;
            this.total = result.total;
            console.log(this.list);
          }
        });
    },
    // 请求简历信息列表
    getTuiList() {
      companyModel
        .getresumeList({
          pageNo: 1,
          pageSize: 5,
          type: this.userinfo.typeName
        })
        .then((res) => {
          if (res.data.code === 200) {
            const result = res.data.result;
            this.tuiList = result.records;
            this.total = result.total;
            console.log(this.tuiList);
          }
        });
    },
  },
  //生命周期（页面加载时执行）
  created() {
    // 取出用户信息
    this.userinfo = JSON.parse(window.localStorage.getItem("userinfo"));
    if (this.userinfo) {
      this.username = this.userinfo.name;
    }
    console.log(this.userinfo);

    this.getresumeList();
    this.getTuiList();
  },
  //监听数据变化
  watch: {},
};
</script>


<style lang="scss" scoped >
@import "../css/CompanyHome.scss";
</style>
